<template>
  <Modal v-model="modal" :title="title" @on-cancel='onCancel'>
    <div class="tag-modal">
      <Form :model="preserve" :label-width="200" ref="form" :rules="rules">
        <FormItem label="APP 抢购门店增长数系数:" prop="storeNumIncreaseCoefficient">
          <InputNumber :max="999" :min="0" v-model="preserve.storeNumIncreaseCoefficient" placeholder="正整数"></InputNumber>
        </FormItem>
         <FormItem label="APP 抢购门店完成率系数:" prop='storeNumCompleteCoefficient'>
          <InputNumber :max="999" :min="0" v-model="preserve.storeNumCompleteCoefficient" placeholder="正整数"></InputNumber>
        </FormItem>
         <FormItem label="APP 抢购数量完成率系数:" prop='purchCompleteCoefficient' >
          <InputNumber :max="999" :min="0" v-model="preserve.purchCompleteCoefficient" placeholder="正整数"></InputNumber>
        </FormItem>
         <FormItem label="轮胎保门店参与率系数:" prop='storeNumProtectionRateCoefficient'>
          <InputNumber :max="999" :min="0" v-model="preserve.storeNumProtectionRateCoefficient" placeholder="正整数"></InputNumber>
        </FormItem>
         <FormItem label="周期开始月份:" prop='beginYearmonth'>
            <DatePicker
            v-model="preserve.beginYearmonth"
            type="month"
            placeholder="选择月份"
            style="width: 200px"
          ></DatePicker>
        </FormItem>
         <FormItem label="周期月份数:" prop='weekMonth'>
          <InputNumber :max="24" :min="1" v-model="preserve.weekMonth" placeholder="正整数" @on-blur='onWeekMonthChange'></InputNumber>
        </FormItem>
      </Form>
    </div>
    <div slot="footer">
      <Button @click="cancel" size="large" type="text">取消</Button>
      <Button :disabled="btnDisabled" @click="onSave" type="primary" size="large">确定</Button>
    </div>
  </Modal>
</template>
<script>
export default {
  components: {},

  data() {
    return {
      id: null,
      modal: false,
      title: "深蓝行动系数维护",
      rules: {
        storeNumIncreaseCoefficient: [{ required: true, message: '请输入增长系数',  type:"number" ,trigger: 'blur' }],
        storeNumCompleteCoefficient: [{ required: true, message: '抢购门店完成率系数不能为空', type: 'number', trigger: 'change' }],
        purchCompleteCoefficient: [{ required: true, message: '抢购数量完成率系数不能为空', type: 'number', trigger: 'change' }],
        storeNumProtectionRateCoefficient: [{ required: true, message: '轮胎保门店参与率系数不能为空', type: 'number', trigger: 'change' }],
        beginYearmonth: [{ required: true, message: '周期开始月份不能为空', type: 'date', trigger: 'change' }],
        weekMonth: [{ required: true, message: '周期月份数范围1-24', type: 'number', trigger: 'change' }],
      },
      preserve:{
        beginYearmonth: "",
        endYearmonth: "",
        id: "",
        purchCompleteCoefficient: '',
        storeNumCompleteCoefficient: '',
        storeNumIncreaseCoefficient: '',
        storeNumProtectionRateCoefficient: '',
        weekMonth: 1, // 月份周期数
      },
      btnDisabled: false,
      flag: false
    };
  },
  computed: {
  },
  methods: {
    openModal() {
      this.modal = true;
      this.getData()
    },
    onCancel() {
      this.$refs['form'].resetFields();
      this.modal = false;
    },
    cancel() {
      this.$refs['form'].resetFields();
      this.modal = false;
    },
    getData() {
      this.$ajaxGet("/report/rank/setting/find").then(data => {
        let res = data
        this.preserve = Object.assign(this.preserve, res)
        if (!this.preserve.beginYearmonth) { // 默认开始日期
          let d = new Date()
          this.preserve.beginYearmonth = d.getFullYear() + '' + (d.getMonth() + 1)
        }
        if (res.beginYearmonth && res.endYearmonth) {
          let b = (res.endYearmonth.substr(0,4) - res.beginYearmonth.substr(0,4))*12
          this.preserve.weekMonth = b + (res.endYearmonth.substr(4) - res.beginYearmonth.substr(4) + 1)
        }
      })
    },
    onWeekMonthChange () {
      let num = this.preserve.weekMonth
      if (num <= 0) {
        this.preserve.weekMonth = 1
      }
      if (num > 24) {
        this.preserve.weekMonth = 24
      }
    },
    formatDate() {
      let { beginYearmonth, endYearmonth } = this.preserve
      let startMonth = new Date(beginYearmonth).getMonth() + 1
      let startYear = new Date(beginYearmonth).getFullYear()
      let allMonth = startMonth + this.preserve.weekMonth - 1
      let upyaer = 0
      let month = allMonth >= 10 ? allMonth : '0'+allMonth
      if (month > 12) {
        upyaer = parseInt(allMonth/12)
        month = (allMonth % 12) >= 10 ?  allMonth % 12 : ('0' + allMonth % 12)
      }
      this.preserve.endYearmonth = startYear + upyaer + '' + month
    },
    onSave() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.formatDate()
          let param = {
              ...this.preserve
          };
          let startYear = new Date(param.beginYearmonth).getFullYear()
          let startMonth = new Date(param.beginYearmonth).getMonth() + 1
          param.beginYearmonth = startYear + '' + (startMonth >= 10 ? startMonth : '0' + startMonth)
          let url = this.preserve.id ? '/report/rank/setting/update' : "/report/rank/setting/save";
          this.$jsonPost(url, param)
            .then(data => {
              this.$Notice.success({
                title: `操作成功`
              });
              this.onCancel();
            })
        }
      });
    }
  }
};
</script>